<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>表单</title>
		<style>
			.item {
				margin-bottom: 15px;
				display: flex;
				align-items: center;
			}
			.item-label {
				width: 100px;
			}
			.item-control {
				flex: 1;
				padding: 7px 10px;
			}
		</style>
	</head>
	<body>
		<!-- 表单是个容器，就像个div -->
		<form action="server" style="width: 520px">
			<!-- 每个div就是一行（表单中的一项、一个栏位） -->
			<div class="item">
				<label class="item-label">名称</label>
				<input type="text" class="item-control" />
			</div>
			<div class="item">
				<label class="item-label">来源</label>
				<select name="" id="" class="item-control">
					<option value="">广告</option>
					<option value="">电话</option>
					<option value="">活动</option>
				</select>
			</div>
			<div class="item">
				<label class="item-label">联系电话</label>
				<input type="text" class="item-control" />
			</div>
			<div class="item">
				<label class="item-label"></label>
				<button>提交表单数据到后端服务器</button>
			</div>
		</form>
	</body>
</html>
